<template>
  <div>
    <div>企业微信列表</div>
    <div>
      <el-table
          ref="multipleTable"
          :data="tableData"
          tooltip-effect="dark"
          style="width: 100%"
          @selection-change="handleSelectionChange">
        <el-table-column
            type="selection"
        >
        </el-table-column>
        <el-table-column
            label="别名"
            prop="key"
        >
        </el-table-column>
        <el-table-column
            prop="value"
            label="名称"
        >
        </el-table-column>
      </el-table>
    </div>
  </div>

</template>

<script>
import {getEnWechatAgentConfig, getEnWechatConfig} from '@/api/index'
const wx = window.wx

export default {
  name: "WechatView",
  data() {
    return {
      selectedRow: null,
      tableData: [
        { key: 'computer', value: '电脑' },
        { key: 'phone', value: '手机' },
        { key: 'car', value: '车' }
      ],
      url:null
    };
  },
  mounted() {
    this.initializeJwxwork();
  },
  watch: {
    selectedRow() {
      console.log(this.selectedRow)
      this.saveSingle()
      this.saveMulti()
    }
  },
  methods: {
    // 在 initializeJwxwork 方法中添加 wx.config 的配置
    initializeJwxwork() {
      this.url = location.href.split("#")[0]
      // 获取企业微信配置
      getEnWechatConfig(this.url)
          .then(response => {


            // 使用 wx.config 配置微信
            wx.config({
              beta: true,  // 必须这样写，否则会有问题
              debug: true,  // 是否开启调试模式，可以在控制台输出日志信息
              appId: response.appId,
              timestamp: response.timestamp,
              nonceStr: response.nonceStr,
              signature: response.signature,
              jsApiList: ['saveApprovalSelectedItems'],
              url: this.url,
            });

            // 微信配置成功后执行的逻辑
            wx.ready(() => {
              console.log('企业微信 JSSDK 配置成功');
              getEnWechatAgentConfig(this.url)
                  .then(response => {
                    wx.agentConfig({
                      corpid: response.appId, // 必填，企业微信的corpid，必须与当前登录的企业一致
                      agentid: response.agentid, // 必填，企业微信的应用id （e.g. 1000247）
                      timestamp: response.timestamp, // 必填，生成签名的时间戳
                      nonceStr: response.nonceStr, // 必填，生成签名的随机串
                      signature: response.signature,// 必填，签名，见附录-JS-SDK使用权限签名算法
                      jsApiList: ['saveApprovalSelectedItems'], //必填，传入需要使用的接口名称
                      success: function (res) {
                        // 回调
                        console.log(res)
                      },
                      fail: function (res) {
                        if (res.errMsg.indexOf('function not exist') > -1) {
                          alert('版本过低请升级')
                        }
                      }
                    });
                  })
            });

            // 微信配置失败后执行的逻辑
            wx.error(err => {
              console.log(err);
            });
          })
          .catch(error => {
            console.log(error);
          });
    },
    saveSingle() {
      console.log('开始保存')
      wx.invoke('saveApprovalSelectedItems', {
        "key": 'Selector-1708753675046',
        "selectedData":JSON.stringify(this.selectedRow)
      }, (res) => {
        if (res.err_msg === 'saveApprovalSelectedItems:ok') {
          console.log('保存成功');
        } else {
          console.error('保存失败', res);
        }
      });
    },
    saveMulti() {
      console.log('开始保存')
      wx.invoke('saveApprovalSelectedItems', {
        "key": 'Selector-1708753675046',
        "selectedData":JSON.stringify(this.selectedRow)
      }, (res) => {
        if (res.err_msg === 'saveApprovalSelectedItems:ok') {
          console.log('保存成功');
        } else {
          console.error('保存失败', res);
        }
      });
    },
    handleSelectionChange(row){
      this.selectedRow = row
    }
  }
}
</script>

<style scoped>
</style>
